<script>
import LeftMenu3 from "../components/LeftMenu3.vue";
import MyContent from "../components/MyContent.vue";

export default {
  name: "App",
  components: { LeftMenu3, MyContent },
  data() {
    return {
      products: [],
      dressList: ["牛仔裤", "连衣裙", "T恤", "短裤", "卫衣"],
      bookList: ["网络技术", "计算机", "操作系统", "Web开发", "Java开发"],
      menu: ""
    };
  },
  //给子孙组件提供数据
  provide() {
    return {
      bookList: this.bookList,
      products: this.products
    };
  },
  mounted() {
    console.log("路由的params参数：", this.$route.params.id);
  }
};
</script>

<template>
  <div class="box">
    <div class="right">
      <MyContent />
    </div>
  </div>
</template>

<style>
body {
  margin: 0;
}
</style>
<style scoped>
.box {
  display: flex;
}
.right {
  flex: 1;
  display: flex;
  flex-direction: column;
}
</style>